<div>
  <button title="Cite Button" aria-label="Cite Button" id="citeBtn" class="button button__micro" data-color="default" data-variant="contained">
    cite
  </button>
  {{ with .Params.links }}
    {{ range . }}
        <a href="{{ .link }}" title="{{ .name }}" class="button button__micro" data-color="default" data-variant="contained" target="_blank" rel="noreferrer">{{ .name }}</a>
    {{ end }}
  {{ end }}
</div>

<div class="modal micromodal-slide" id="modal" aria-hidden="true">
  <div class="modal__overlay" tabindex="-1" data-micromodal-close>
    <div class="modal__container" role="dialog" aria-modal="true" aria-labelledby="modal-title">
      <div class="modal__paging">
        Cite
      </div>
      <div class="modal__icon modal__toolbar--close" title="Close" aria-label="Close Button" data-micromodal-close>
        {{ partial "svgs/etc/close.svg" (dict "width" 25 "height" 25) }}
      </div>
      <main class="modal__cite">
        {{ $filePath := (print .Permalink "cite.bib" | relLangURL) }}
        {{ if fileExists $filePath }}
          <div class="modal__cite--exist" id="citeContents">
            {{ readFile $filePath | markdownify }}
          </div>
        {{ else }}
          <div class="modal__cite--notexist">
            cite.bib file not found
          </div>
        {{ end }}
      </main>
      <button id="copyBtn" class="button modal__copy" data-color="default" aria-label="Cite Copy Button" data-clipboard-target="#citeContents">
        {{ i18n "copy" | default "Copy"}}
      </button>
    </div>
  </div>
</div>
